<template>
  <div id="container">
    <common v-if="!isCustom" />
    <custom v-else-if="isCustom" />
  </div>
</template>

<script>
import common from "./common.vue"; //头部组件
import custom from "./custom.vue"; //头部组件
import { reqDeviceList } from "@api/api.js";
import { mapState } from "vuex";

export default {
  name: "datav",
  components: {
    common,
    custom,
  },
  data() {
    return {
      isCustom: false,
    };
  },
  computed: {
    ...mapState(["user"]),
    deviceCode() {
      return this.$store.state.fire.fireDeviceCode;
    },
  },
  watch: {
    // 监听store.fire.deviceCode
    deviceCode(newVal, oldVal) {
      console.log("deviceCode 变化:", newVal, oldVal);
      this.getDeviceInfo(newVal);
    },
  },

  async mounted() {},
  methods: {
    async getDeviceInfo(imei) {
      if (!imei) return;
      const res = await reqDeviceList(1, 1, {
        userId: this.user.userId,
        roleName: this.user.roleName,
        tenantId: this.user.tenantId,
        imei,
      });
      if (res.code !== 20000) return this.$modal.notifyWarning(res.message);
      console.log("res.data.rows;", res.data.rows);
      const { classMark } = res.data.rows[0];
      console.log("classMark", classMark);
      if (
        (this.$store.state.user.tenantId === "1585818639366049704" ||
          this.$store.state.user.tenantId === "1630096883098071041") &&
        classMark === "A310"
      ) {
        this.isCustom = true;
      } else {
        this.isCustom = false;
      }
    },
  },
  destroyed() {
    this.$store.commit("saveDeviceCode", "");
  },
};
</script>

<style lang="less" scoped>
#container {
  width: 100%;
  height: 100%;
}
</style>
